src/pages/[...path].tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56

import _ from 'lodash';
import type { GetStaticPropsContext, NextPage } from "next";
import ReactMarkdown from 'react-markdown';
import Head from "next/head";
import deepReadDir from "../deepReadDir";
import fs from 'fs';


const MARKDOWN_DIR = '../eug-vs-xyz/src';

const transformLinkURI = (uri: string): string => {
  return uri.match(/(.*)\.md/)?.[1] || uri;
}

export const getStaticProps = async (context: GetStaticPropsContext) => {
  const path = _.isArray(context.params?.path) && context.params?.path || [context.params?.path];
  const markdownSource = fs.readFileSync(`${MARKDOWN_DIR}/${path?.join('/')}.md`).toString();
  return {
    props: {
      markdownSource,
      path,
    }
  }
}

export const getStaticPaths = async () => {
  const globalPaths = await deepReadDir(MARKDOWN_DIR);
  const paths = globalPaths
    .map(globalPath => globalPath.match(`${MARKDOWN_DIR}/(.*)\.md`)?.[1] )
    .filter(p => p)
    .map(p => p?.split('/'))
    .map(path => ({ params: { path } }));
  console.log(paths);
  return {
    paths,
    fallback: false,
  }
}

const Page: NextPage = ({ markdownSource }: any) => {
  return (
    <>
      <Head>
        <title>Create T3 App</title>
        <meta name="description" content="Generated by create-t3-app" />
        <link rel="icon" href="/favicon.ico" />
      </Head>
      <main>
        <ReactMarkdown transformLinkUri={transformLinkURI}>{markdownSource}</ReactMarkdown>
      </main>
    </>
  );
};

export default Page;